
// 这里的node代码会用babel处理
import React from "react"
import { renderToString } from "react-dom/server";
import { StaticRouter } from "react-router-dom/server";
import { Provider } from 'react-redux'
import HttpContext from "./httpContext";
import App from '../src/app'


const render = (store, req, context) => {
  // ! 这里传下去staticContext子组件消费的时候并不能拿到这里的结果，拿到的是默认值
  const staticContext = { staticContext: context };
  // 把react组件解析成html
  const content = renderToString(
    <Provider store={store} >
      <HttpContext.Provider value={staticContext}>
        <StaticRouter location={req.url} >
          <App />
        </StaticRouter>
      </HttpContext.Provider>
    </Provider >
  );


  return `<html>
          <head>
            <meta charset="utf-8"/>
            <title>react ssr</title>
          </head>
          
          <body>
            <div id="root">${content}</div>
            <script >
              window.__context = ${JSON.stringify(store.getState())}
            </script>
            <script src="/bundle.js"></script>
           
          </body>  
        </html>`
}
export default render;